<script setup>
  import { ref } from "vue";
  import { profileApi, taskApi, truckApi } from "../../apis/user";

  import { onLoad } from '@dcloudio/uni-app'

  // 用户信息state
  const userProfile = ref({})
  // 方法mutation
  async function getUserProfile() {
    const { code, data } = await profileApi()
    console.log('数据', data)
    console.log('数据', code)
    if (code === 200) {
      userProfile.value = data
      console.log('数据1', userProfile)
    }
  }

  // 任务数据
  const taskInfo = ref({})

  // 任务数据
  async function getTaskInfo() {
    try {
      const { code, data } = await taskApi('2023', '07')
      // 检测接口否调用成功
      if (code === 200) {
        // 渲染请求来的数据
        taskInfo.value = data
      }
    } catch (err) {
      console.log(err)
    }
  }

  // 车辆信息
  const truchInfo = ref({})
  // 获取车辆信息
  async function getTruckInfo() {
    const { code, data } = await truckApi()
    // 检测接口否调用成功
    if (code === 200) {
      // 渲染请求来的数据
      truchInfo.value = data
    }
  }
  onLoad(() => {
    getUserProfile()
    getTaskInfo()
    getTruckInfo()
  })
</script>


<template>

  <view class="page-container">
    <view class="user-profile">
      <image class="avatar" :src="userProfile.avatar" mode=""></image>
      <text class="username">{{userProfile.name}}</text>
      <text class="no">司机编号：{{ userProfile.number}}</text>
      <text class="mobile">手机号码：{{ userProfile.phone }}</text>
    </view>
    <view class="month-overview">
      <view class="title">本月任务</view>
      <view class="content">
        <view class="item">
          <text class="volumn">{{ taskInfo.taskAmounts }}</text>
          <text class="label">任务总量</text>
        </view>
        <view class="item">
          <text class="volumn">{{ taskInfo.completedAmounts }}</text>
          <text class="label">完成任务量</text>
        </view>
        <view class="item">
          <text class="volumn">{{ taskInfo.transportMileage }}</text>
          <text class="label">运输里程(km)</text>
        </view>
      </view>
    </view>
    <view class="entry-list">
      <uni-list :border="false">
        <uni-list-item to="/subpkg_user/truck/index" showArrow title="车辆信息" />
        <uni-list-item to="/subpkg_user/task/index" showArrow title="任务数据" />
        <uni-list-item to="/subpkg_user/settings/index" showArrow title="系统设置" />
      </uni-list>
    </view>
  </view>
</template>

<style lang="scss" scoped>
  @import './index.scss';
</style>